import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App.jsx'
import './index.css'
import {
  createBrowserRouter,
  RouterProvider,
} from "react-router-dom";
import Home from './pages/Home.jsx';
import ArticlesPage from './pages/Articles.jsx';
import LifePage from './pages/Life.jsx';
import DetailPage from './pages/DetailPage.jsx';
import NotesPage from './pages/Notes.jsx';
import ProjectsPage from './pages/Projects.jsx';
import AboutPage from './pages/About.jsx';

const router = createBrowserRouter([
  {
    path: "/",
    element: <App />,
    children: [
      {
        path: "/",
        element: <Home />,
      },
      {
        path: "/articles",
        element: <ArticlesPage />,
      },
      {
        path: "/life",
        element: <LifePage />,
      },
      {
        path: "/details/:id",
        element: <DetailPage />,
      },
      {
        path: "/notes",
        element: <NotesPage />,
      },
      {
        path: "/projects",
        element: <ProjectsPage />,
      },
      {
        path: "/about",
        element: <AboutPage />,
      },
    ],
  },
]);

ReactDOM.createRoot(document.getElementById('root')).render(
  <React.StrictMode>
    <RouterProvider router={router} />
  </React.StrictMode>,
)
